import { defineConfig } from 'vite'
//这个轮子会做组件的自动更新，自动刷新加载组件
import reactRefresh from '@vitejs/plugin-react-refresh'
//这是个npm的轮子，可以帮我们动态打包CSS文件。在打包的时候生效即可。
import styleImport from 'vite-plugin-style-import'
import path from 'path'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [reactRefresh(), styleImport(
    {
      libs: [{
        libraryName: 'zarm',
        esModule: true,
        resolveStyle: (name) => {
          return `zarm/es/${name}/style/css`
        }
      }]
    }
  )],
  css: {
    modules: {
      localsConvention: 'dashesOnly'
    },
    preprocessorOptions: {
      less: {
        javascriptEnabled: true
      }
    }
  },
  server: {
    proxy: {
      '/api': {
        target: 'http://47.101.32.130:7001', //之后就可以这样使用：/api/userInfo => http://localhost:7001/api/userInfo
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, '')
      }
    }
  },
  // 别名
  resolve: {
    alias: {
      // 那么现在在项目内任何地方写@，就代表的是src开始的路径
      '@': path.resolve(__dirname, 'src'),
      // 同上
      'utils':path.resolve(__dirname,'src/utils')
    }
  }
})
